<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>复杂场景渲染</title>
    <link rel="stylesheet" href="css/animate.css">
    <link rel="stylesheet" href="./minemap.css">
    <script src="./minemap.js"></script>
    <link rel="stylesheet" href="./dist/index.css">
</head>
<body>

<div id="control-panel">
    <div id="title">传感器安全云服务</div>
    <div id="title-line"></div>

    <div class="info-card card-active animated" id="card0">
        <div class="num-within-wrap">
            <img src="texture/control-panel/img-1-selected.png" class="num-within">
        </div>
        <div class="info-title">
            传感器安全云服务
        </div>
        <img class="img-area" src="texture/control-panel/img-shigu.png">
        <div class="description">
            日趋严重的交通拥堵，极端恶劣天气，不良道路条件和复杂路面环境等因素对驾驶安全有着直接的影响。地图、动态交通信息结合车载传感器数据源以及交警、天气等第三方数据源，传感器安全云服务为车主和车辆辅助驾驶系统提供安全预警服务，以帮助车主和车辆辅助驾驶系统及时有效地对前方危险情况主动地作出反应。
        </div>
    </div>

    <div class="info-card animated" id="card1">
        <div class="num-within-wrap">
            <img src="texture/control-panel/img-1-selected.png" class="num-within">
        </div>
        <div class="info-title">
            交通事故
        </div>
        <img class="img-area" src="texture/control-panel/img-shigu.png">
        <div class="description">
            结合道路的实际速度及道路通行条件，量化评价道路拥堵情况；案例体现对昆明市主要路段的实时拥堵排名；可以提供对行政区划、热点区域、自定义区域、路段的量化交通指数；
            <br>目前支持算法有：北京算法、四维算法、上海算法。
        </div>
    </div>

    <button id="next-card">
        下一步
    </button>

    <button id="reset">
        重置
    </button>

    <div id="num-panel">
        <!--<img src="texture/control-panel/img-1.png" class="seq-label num1">-->
        <img src="texture/control-panel/img-2.png" class="seq-label num2">
        <img src="texture/control-panel/img-3.png" class="seq-label num3">
        <img src="texture/control-panel/img-4.png" class="seq-label num4">

        <div class="seq-label-text text2">交通事故</div>
        <div class="seq-label-text text3">车辆抛锚</div>
        <div class="seq-label-text text4">湿滑道路预警</div>
    </div>

    </div>
</div>

<div id="map"
     style="background:url('texture/background/sky.gif');background-repeat: repeat;background-size: 1080px 576px;">
    <img id="biandao-icon" src="texture/shigu-biandao.png"
         style="">
    <img id="fly-button" src="texture/huhuai/icon-fly-start.png">
</div>
<script src="./dist/bundle.js"></script>
</body>
